<template>
  <el-dropdown @command="handleSetLanguage">
    <div class="el-dropdown-link learun-header--icon-btn lang-btn">
      <div class="learun-header--icon-btn-wraper" ><i class="learun-icon-translation" /></div>
    </div>
    <el-dropdown-menu slot="dropdown">
      <el-dropdown-item
        v-for="item in languageTypes"
        :key="item.f_Id"
        :disabled="appConfig.language.type === item.f_Code"
        :command="item.f_Code"
        >{{ item.f_Name }}</el-dropdown-item
      >
    </el-dropdown-menu>
  </el-dropdown>
</template>

<script>
export default {
  name: "lang",
  computed: {
    languageTypes() {
      return this.$store.state.language.type.list;
    },
  },
  methods: {
    handleSetLanguage(lang) {
      this.$store.commit("app/SET_LANGUAGE", lang);
      location.reload();
    },
  },
};
</script>
<style lang="scss" scoped>
.lang-btn {
  font-size: 16px;
}
</style>
